
/***框架布局***/

.grwitdh{width: 1200px;margin: 0 auto;}
.header{}

.header .top{ text-align:right}
.header .top a{ color:#999; font-size:12px; display: inline-block; border-right: dashed 1px #ccc ; line-height:10px;padding:0 24px; margin: 10px 5px  }
.header .top a:last-child{ border:none}
.header .top a:hover{color:#20a3cf}

.header .top .weixin{ position:relative;}
.header .top .weixin .img{display:none;position:absolute; left:-18px;top:15px;z-index:999;padding:5px;border:1px #555 solid; background:#999}
.header .top .weixin:hover img{ display:block}

.header .tel{ float:right; margin:0px 0 0 0}
.header .tel span{ float:left;padding:10px 0 10px 80px;display: block; color:#999; font-size:12px;}
.header .tel span.one{background: url(../images/tel_ico.png) left no-repeat;}
.header .tel span strong{ display:block;color:#20a3cf; font-size:24px;}


.header .nav{ margin:20px 0 0 0;background: #000;}
.header .nav ul li{ position: relative;float:left; display: block;border-right: solid #333 1px;width:199px;height:50px;line-height:50px;text-align:center;}
.header .nav ul li a{display: block;color:#999; font-size:16px; text-align:center;}
.header .nav ul li a:last-child{/*border-right:none*/}
.header .nav ul li:hover,.header .nav ul li.active{ background: #20a3cf; color:#fff;}
.header .nav ul li:hover a,.header .nav ul li.active a{ color:#fff;}



.header .nav ul li:hover .box{ display: table;}
.header .nav .box{ display: none; position: absolute;z-index:999;left:0;top:50px;float:left;padding:20px 30px;margin:0 0 0 0px; background:#333}
.header .nav .box .left{  display:table-cell;vertical-align:top }
.header .nav .box .left .rom{
	/*height:200px;*/
	margin-right:0px;
}



.header .nav .chanpinzhongxin .left .rom{-moz-column-count:2; -webkit-column-count:2;column-count:2;}
.header .nav .case .left .rom{-moz-column-count:2; -webkit-column-count:2;column-count:2;}

.header .nav .box .left a{-webkit-column-break-inside:avoid;width:130px;text-align:left; line-height:35px;color:#999; margin:0 20px 0 0;padding:0 0px 0 10px;font-size:13px; border-bottom: dashed 1px #555;background: url(../images/arrow_one.png) left no-repeat;}
.header .nav .box .left a:hover{ color:#20a3cf}

.header .nav .box img{display:table-cell;margin-left:15px; }





.homeB{ margin:20px 0}
.homeB .container{display: flex;}
.homeB .box{ position: relative; width:400px;background: #1c81a3;}
.homeB .box>img{
	display: none;
}
.homeB .box .sbox{ text-align: center;padding:30px 40px 40px;}
.homeB .box .sbox img{ display: block; margin: auto;}
.homeB .box .sbox h3{margin:10px; color:#FFFFFF; font-size:20px; font-weight:bold;}
.homeB .box .sbox p{ color:#FFFFFF; font-size:15px; line-height: 22px;}
.homeB .box:hover{background: #256981}



.homeC{ float:left; width:100%; margin:20px 0 50px 0}

.homeC h2.title{ color:#20a3cf; font-size:20px; margin: -3px 0 20px 0 }
.homeC h2.title span{ color:#999; font-size:14px}
.homeC h2.title a{float: right;line-height:30px;padding-left:15px; background:url(../images/more_ico.png) no-repeat left;color:#999; font-size:14px}
.homeC h2.title a:hover{color:#20a3cf}

.homeC .left{ width:430px;}
.homeC .left .lump{ border-bottom: 1px #555 solid;padding:0 0 20px 0}
.homeC .left h3{ margin:10px 0;color:#999; font-size:15px;}
.homeC .left p{ color:#999; font-size:13px}

.homeC .middle{ width:400px; margin: 0 43px;}
.homeC .middle .tabPanel{ float:left; width:100%;}
.homeC .middle .tabPanel .tone{border-bottom: #555 1px solid;margin:0 0 20px 0;padding:0 0 10px 0}
.homeC .middle .tabPanel .tone b{ color:#999; font-size:20px;     cursor: pointer;}
.homeC .middle .tabPanel .tone b.hit{color:#20a3cf; font-weight:bold;}
.homeC .middle .tabPanel .tone b:hover{color:#20a3cf;}
.homeC .middle .tabPanel .tone em{ margin:0 5px;font-style: normal;}
.homeC .middle .tabPanel .tone em:last-child{display:none;}
.homeC .middle .tabPanel .down .pane{ display: none;}
.homeC .middle a.one{ float:left; width:100%; border-bottom:dashed 1px #555; padding-bottom: 10px;margin-bottom:10px;}
.homeC .middle a.one .leftImg{ float:left;width:130px;}
.homeC .middle a.one .leftImg img{ float:left; width:130px;}
.homeC .middle a.one .right{ width:250px; margin-left:20px;} 
.homeC .middle a.one .right h4{color:#999; font-size:15px}
.homeC .middle a.one .right p{margin:10px 0;color:#999; font-size:12px;}
.homeC .middle a.one .right span{ margin:0px 0 0 0; font-size:12px; color:#999;}
.homeC .middle a.one:hover .right h4{color:#20a3cf}
.homeC .middle a.one:hover .right p{color:#20a3cf}



.homeC .middle a.two{ float:left;width:100%; clear:both;display: block; margin:4px 0;background: url(../images/arrow_one.png) left no-repeat;padding-left:10px;color:#999; font-size:12px;}
.homeC .middle a.two span{ float:right;color:#999}
.homeC .middle a.two:hover{color:#20a3cf}

.homeC .right h2.title{ border-bottom: 1px #555 solid;padding-bottom:8px;}
.homeC .right{ width:282px}
.homeC .right .lump a{ float: left;width:125px; display: block; margin:5px 5px;border: 1px #555 solid; }
.homeC .right a img{width: 100%;height: 68px; }
.homeC .right .lump a:hover{ border: 1px #20a3cf solid;}

.homeD{float: left;width: 100%;margin: 20px 0 50px 0;overflow: hidden;position: relative;}
.homeD .container h2{border-bottom: #555 1px solid;padding-bottom: 10px;margin-bottom: 10px;}
.homeD .container h2 span{font-size: 14px;}
.homeD .container h2 strong{color: #20a3cf;font-size: 20px;}
.homeD .container ul li{overflow: hidden; width: 274px;height: 254px;float: left;text-align: center; border: 1px solid #555 ;margin-left: 20px;transition: 0.5s all;}
.homeD .container ul li h3{height: 40px;line-height: 36px;}
.homeD .container ul li .proImg{display: block;overflow: hidden; width: 274px;height: 210px}
.homeD .container ul li img{max-width: 274px;height:210px; transition: 0.5s all;}
.homeD .container .more{    float: right;line-height: 30px;padding-left: 15px;background: url(../images/more_ico.png) no-repeat left;color: #999;font-size: 14px;}
.homeD .container ul li:hover {border:1px solid #20a3cf;}
.homeD .container ul li:hover img{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
.homeD .container ul li:hover h3{color: #20a3cf;}
.homeE{float: left;width: 100%;margin: 0 0 50px 0;}
.homeE .container h2{border-bottom: #555 1px solid;padding-bottom: 10px;margin-bottom: 10px;}
.homeE .container h2 span{font-size: 14px;}
.homeE .container h2 strong{color: #20a3cf;font-size: 20px;}
.homeE .container ul li{overflow: hidden; width: 218px;height: 200px;float: left;text-align: center; border: 1px solid #555;margin: 0 10px;transition: 0.5s all;}
.homeE .container ul li h3{height: 40px;line-height: 36px;}
.homeE .container ul li .envImg{display: block;overflow: hidden; width: 218px;height: 160px}
.homeE .container ul li img{overflow: hidden;width: 218px;height:160px; border-bottom: 1px solid #555; transition: 0.5s all;}
.homeE .container .more{    float: right;
    line-height: 30px;
    padding-left: 15px;
    background: url(../images/more_ico.png) no-repeat left;
    color: #999;
    font-size: 14px;}
.homeE .container ul li:hover {border:1px solid #20a3cf;}
.homeE .container ul li:hover h3{color: #20a3cf;}
.homeE .container ul li:hover img{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
.rack .lefter{ float:left; width:240px;}


/*sonNav*/
.sonNavBox{border: 1px #555 solid;}
/* .sonNavBox h2{  background:#20a3cf url(../images/icoNav.png) no-repeat left; padding:25px 10px 25px 80px;font-size:20px; color:#fff} */
.sonNavBox h2{ background-color: #20a3cf; padding:25px 10px 25px 80px;font-size:20px; color:#fff}
.sonNavBox h2 span{ display:block;font-size:15px;color:#eee;text-transform:uppercase;}
.sonNavBox h2{}
.sonNavBox li{ border-bottom:1px #555 solid;} 
.sonNavBox li h3{padding:10px 34px;  cursor: pointer;} 
.sonNavBox li h3 a{  color:#999; font-size:15px;padding-left:37px;background:url(../images/icoNavli.png) no-repeat left}

.sonNavBox li.active h3{border-bottom:1px #555 solid;background:#1e1c1b ; }
.sonNavBox li.active h3 a{color:#999}
.sonNavBox li.active .sonNavContent{ display:block}
.sonNavBox li.active .sonNavContent a{ display:block}
.sonNavBox li .sonNavContent{ display:none; }
.sonNavBox li .sonNavContent a{ display: none;padding:12px 0 12px 45px;  color:#999; font-size:13px; border-bottom: dashed 1px #555; }
.sonNavBox li .sonNavContent a:last-child{ border-bottom:0px;}

.sonNavBox li h3:hover,.sonNavBox li h3.active{ background:#1e1c1b ;}
/* .sonNavBox li h3:hover a,.sonNavBox li h3.active a{ color:#999} */
.sonNavBox li h3:hover a,.sonNavBox li h3.active a{ color:#20a3cf}


.sonNavBox li h3.active a{ color:#999}
.sonNavBox li .sonNavContent a:hover{color:#1e1c1b}




.rack{ margin:20px 0 50px 0}
.rack .lefter .search{ margin:20px 0 20px 0; border:solid 1px #555}
.rack .lefter .search h3{ background:#1e1c1b; padding:10px 10px; color:#999; font-size:16px;}
.rack .lefter .search .bin{padding:20px;}
.rack .lefter .search input{ float:left; width:140px;border: 1px #555 solid; height:28px;padding:0 10px;}
.rack .lefter .search button{ float:left; display:block; background:#20a3cf; border:none; height:30px;
	
    cursor: pointer;}
  
.rack .lefter .search p{ display:block;padding:20px;color:#555555; font-size:12px;}  

.rack .lefter .down{ margin:10px 0;}

.rack .righter{ float:right; width:930px;}





.list-one a{float:left; width:290px; margin:10px 10px 20px 10px}
.list-one a img{ width:100%; height:230px;}
.list-one a h4{font-size: 18px;margin:5px 0;color: #999;}
.list-one a p{ margin:10px 0 10px 0;color:#999; font-size:12px; text-align: left;}
.list-one a span{ float:left;display: block;color:#999999;border:1px #999 solid;  padding:5px 25px;}
.list-one a:hover h4{ color:#20a3cf;}
.list-one a:hover span{ background:#20a3cf; color:#999; border:1px solid #20a3cf}

/*list-two*/

/*list-news*/
.list-news{}

.list-news ul{ float:left; margin:0px 0 0 0;}
.list-news ul li{ float:left; width:100%;margin:0 0 30px 0;border:solid 1px #555;}
.list-news ul li img{float:left;width:200px;}
.list-news ul li .right{ float:left; width:690px;padding:20px;}
.list-news ul li .right h4{ color:#fff;font-size:18px;}
.list-news ul li:hover .right h4{ color:#20a3cf;}
.list-news ul li .right span{margin:5px 0 0 0; display: block;color:#b4b3b1; font-size:12px;}
.list-news ul li .right p{ margin:20px 0 0 0;color:#999;  font-size: 14px;;}
.list-news ul li:hover{ background:#eee}
.list-news ul li:hover p{color:#20a3cf}

.gr-fenx{height:35px;background:#555;padding:0 10px;margin-top:25px; font-size:14px;color:#999}
.gr-fenx a{color:#999}
.gr-fenx a:hover{ color:#00b9e7}
.prew {background:url(../images/pre_info.gif) no-repeat left center;float:left;height:35px;line-height:35px;overflow:hidden;padding-left:15px;text-align:left;width:46%;}
.nextw {background:url(../images/next_info.gif) no-repeat right center;float:right;height:35px;line-height:35px;overflow:hidden;padding-right:15px;text-align:right;width:46%;}
.gr-keyword{border:1px solid #dadada;padding:5px 10px;margin:10px 0;overflow:hidden;}
.gr-keyword a{padding:0 5px;color:#999;}
.gr-keyword a:hover{color:#00b9e7}
.newsShow_main{overflow:hidden;padding:15px}
.newsShow_main .newsShow_img{width:300px;height:300px;}
.newsShow_main .news-show-box{float:right;width:740px;padding:0;}


/* 推荐资讯样式 */
.gr-rec-news{margin-top:10px;overflow:hidden;}
.gr-rec-news ul{width:950px;padding-top:10px;}
.gr-rec-news ul li{float:left;margin-right:30px;width:430px;height:28px;line-height:28px;}
.gr-rec-news ul li a{display:block;width:310px;color:#999;line-height:28px;background:url(../images/ly_li.png) no-repeat left center;padding-left:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;float:left;}
.gr-rec-news ul li a:hover{color:#00b9e7}
.gr-rec-news ul li span{float:right;color:#999; font-size:12px}
.rec-title{padding-left:20px;height:35px;line-height:35px;background:url(../images/page_line.jpg) no-repeat 10px 10px #555;font-size:14px;font-weight:bold;color:#999;}



.list-three a{float:left; width:212px; margin:10px 10px 20px 10px}
.list-three a img{ width:100%;height:190px;}
.list-three a .effect_two{ border:1px #555 solid}
.list-three a h4{font-size: 16px;margin:5px 0;color: #999; text-align: center;}
.list-three a:hover h4{color:#20a3cf}
.list-three a:hover .effect_two {border:1px #20a3cf solid}

.list-four a{float:left; width:212px; margin:10px 10px 20px 10px}
.list-four a img{ width:100%;height: 155px;}
.list-four a .effect_two{ border:1px #555 solid}
.list-four a h4{font-size: 14px;margin:5px 0;color: #999; text-align: center;}
.list-four a:hover h4{color:#20a3cf}
.list-four a:hover .effect_two {border:1px #20a3cf solid}




/*download*/
.download{float:left; width:100%; margin:0px 0 0px 0;}
.download li{float: left;width: 100%;height: 60px; border: 1px solid #ccc;margin-bottom: -1px;}
.download a h4{color:#999;font-size:16px;margin-top: 28px;}
.download a p{color:#999; font-size:13px;margin:5px 0;width: 300px;}
.download a span{ display: block;margin:0px 0 0 0;font-size:12px;color:#999;background: url(../images/download.png) no-repeat; background-position:0px 15px ;}
.download a span em{float:right; background:#ccc;border-radius: 20px;padding:5px 10px; color:#999; font-size:x-small;}
.download_1{float: left;border-right: 1px solid #ccc;margin-right: 20px;width: 200px;text-align: center;}
.download_2{float: left;width: 509px;text-align: left;line-height: 60px; padding-left:20px;}
.download_3{float: right;width: 199px;text-align: center;line-height: 50px;border-left: 1px solid #ccc;}
.download_3 img{position: relative;top: 7px;}   






/*show-product*/
.show-product{float:left;width:100%;}
.show-product .left{float:left; width:350px;}
.show-product .left p{text-align:center;width:120px;margin-left:100px;background:#cc0000;line-height:30px;}
.show-product .left p a{color:#999}
.show-product .left img{max-width:100%;width:100%}
.show-product .right{ float:right; width:550px}
.show-product .right .title{ color:#999; font-size:18px; font-weight:bold}
.show-product .right .box{ margin:20px 0 0 0; color:#999; font-size:13px; line-height:24px; }
.show-product .right .frame{display: none;height:40px;line-height: 40px;margin-top:20px; padding-top:20px; border-top: 1px #555 solid; padding-left:60px;color:#999; font-size:12px;background: url(../images/tel_ico.png) no-repeat left; background-size:50px; background-position:0px 28px }
.show-product .right .frame b{ display: block;margin:3px 0 0 0;color:#0599c7; font-size:20px;}
.show-product .right .zx{ float:left; display:block; color:#fff; background:#0599c7; padding:10px 20px; margin:20px 0 0 0;}
.show-product .right .dd{ float:left; display:block; color:#999; background:#000; padding:10px 20px; margin:20px 0 0 0;margin-left: 10px;}
.show-product .right .zx:hover{ background:#f60}{ float:left; display:block; color:#999; background:#cc0000; padding:10px 20px; margin:20px 0 0 0;}
.show-product .right .dd:hover{ background:#f60}{ float:left; display:block; color:#999; background:#cc0000; padding:10px 20px; margin:20px 0 0 0;}
.show-product .down{ float:left; width:100%; margin:30px 0 0 0;}
.show-product .down h2{ color:#999; font-size:20px; line-height: 45px;; margin:0 0 20px 0;border-bottom:solid 1px #999}







/*contact*/
.contact{}
.contact h2{ color:#1a1a1a; font-size:25px;margin:0px 0 50px 0; }
.contact .long{ float:left;width:100%}
.contact .long b{ float: left; width:20%; /*border-right: solid 1px #555 ;*/ text-align: center;}
.contact .long b h4{ color:#999; font-size:14px; font-weight:400}
.contact .long b h4 span{margin:5px 0; display: block;; color:#999; font-size:13px;}
.contact .box{ font-size:14px;color:#999; line-height:25px;}

.contact #dituContent{ float:left;width:100%;height:450px; margin:40px 0 0 0;}



/*commente*/

.comments{ float:left; width:100%;  margin:0 0 20px 0}
.comments form{ width:100%; margin:auto;padding:0px 0 50px 0;}
.comments form .one{ float:left; width:420px; margin-right:20px}
.comments form .two{ float:right; width:420px;}
.comments form .three{ float:left; width:100%;}
.comments input{outline: none; padding-left:25px;border-bottom:1px solid #999;background:none; margin:20px 0 0 0; color:#777;  height:45px; line-height:45px; font-size:15px;border-left:none; border-right:none; border-top:none;}


.comments form input.xA{ background:#999 url(../images/ico-01.png) no-repeat; background-position:0px 15px ;}
.comments form input.xB{ background:#999 url(../images/ico-03.png) no-repeat; background-position:0px 15px ;}
.comments form input.xC{ background:#999 url(../images/ico-02.png) no-repeat; background-position:0px 15px ;}
.comments form input.xD{ background:#999 url(../images/ico-04.png) no-repeat; background-position:0px 15px ;}


.comments form textarea{ outline: none;float:left;padding-left:25px;margin:20px 0 0 0; background:none;height:110px;width:100%;border-bottom:1px solid #999; color:#777;font-size:15px;border-left:none; border-right:none; border-top:none;
background:#999 url(../images/ico-05.png) no-repeat; background-position:0px 4px ;
 }
.comments form *::-moz-placeholder{color:#000}
.comments form button{ float:left;display:block;cursor: pointer;  background:#999; font-size:17px; border:none; margin:20px auto; color:#999; padding:10px 50px;}
.comments form button:hover{ background:#20a3cf}
.comments .title{ float:left; width:100%;text-align:left; margin:50px 0 35px; color:#999; font-size:30px;   /* font-family: 'Gabriela', serif;*/}
.comments .title {}
.comments .title b{  margin:10px 0 0 0; font-size:12px; color:#777; font-weight:400; }
.comments .title span{
    display: block;
    border: 2px solid #ccc;
    width: 14px;
    height: 14px;
    border-radius: 100%;
    margin: .4em auto 0em;
    position: relative;
}



/*footer*/

.footer{background: #1e1c1b;padding:50px 0 0 0}
.footer .top{ border-bottom: 1px #555 solid;padding:0 0  10px 0;margin-bottom:20px }

.footer .top h2{color:#999; font-size:20px; font-weight:bold; margin:0 0 15px 0}
.footer .top a{ display: inline-block;color:#999;font-size:12px; margin:0 10px 0 0 }  
.footer .top a:hover{color:#20a3cf}

.footer .left{ width:600px;}
.footer .left h2{ color:#20a3cf; font-size:22px; font-weight:bold}
.footer .left h2 span{ display: block;margin:5px 0 0 0; color:#999; font-size:12px; font-weight:400}

.footer .left form{ margin:20px 0 0 0;}
.footer .left form input{ float: left;width:240px; border:none;margin:0 10px 10px 0;background: #999; padding:10px 10px 10px 40px; color:#000; font-size:14px;}
.footer .left form input.one{ background:#999 url(../images/ico-01.png) no-repeat; background-position:15px 10px ;}
.footer .left form input.two{ background:#999 url(../images/ico-02.png) no-repeat; background-position:15px 10px ;}
.footer .left form input.three{ background:#999 url(../images/ico-03.png) no-repeat; background-position:15px 13px ;}
.footer .left form input.four{ background:#999 url(../images/ico-04.png) no-repeat; background-position:15px 10px ;}


.footer .left form textarea{ width:540px;border:none;margin:0 10px 10px 0;background: #999; padding:7px 10px 5px 40px; color:#000; font-size:14px;
background:#999 url(../images/ico-05.png) no-repeat; background-position:15px 10px ;
}
.footer .left form button{   cursor: pointer; color:#fff; padding:15px 0;width:250px; border:none;font-size:12px; text-align:center;background: #20a3cf;}
.footer .left form button:hover{background:#00b0db;}


.footer .right{ margin-left:20px; padding-left:100px; border-left:1px #555 dashed;}
.footer .right .tel{ color:#999;; font-size:14px; background: url(../images/tel_02_ico.png) no-repeat left;padding-left:50px;}
.footer .right .tel span{ display:block;color:#20a3cf; font-size:24px;}
.footer .right .box{ margin:50px 0 0 0; color:#999; font-size:13px; line-height: 24px;;}
.footer .right .box a{ color:#999; font-size:13px}
.footer .right .box a:hover{color:#20a3cf }

.footer .bottom{ margin:20px 0 0 0;background:#000; padding:20px 0;}
.footer .bottom h3{ float:left; line-height:25px;color:#20a3cf; font-size:12px; margin:0 10px 0 0}
.footer .bottom h3 span{color:#999999}

.footer .bottom a{color:#999; font-size:12px;  margin:0 10px 0;padding:0 10px 0 0;line-height:10px; border-right:1px #aaa dashed;}
.footer .bottom a:hover{color:#20a3cf}


.display_table{
	width: 100%;
	/*background: #fff;*/
}

.display_table td{
	padding: 0 10px;
}

.tab_box table td{
    border-top: 1px solid #ececec;
    border-right: 1px solid #ececec;
    padding: 10px;
}